/*
 * 用户列表界面的快速操作（2022.5.23）
 * 暂定配合扩展mixins使用
 * 核心部分相同
 * 扩展系统独有功能
 * 设置获取列表接口 this.LIST_API promise
 * 设置导出列表接口 this.EXPORT_API promise
 * 条件WHERE{}
 * 搜索 this._search()
 * 导出 this._export
 * 重置 this._reset
 * 页码选择和页数选择
 * 5.23
 * 添加新的导出下载方式 自定义文件名
 * 5.20
 * 读取excel
 * 添加emoji判断
 * 添加列表清除
 * 5.17
 * 更新PARAMS
 * 防止计算属性监听不到更新
 * 4.29
 * 默认值修正
 * 4.28
 * 跟着后台改逻辑
 * 4.21
 * 获取部门员工
 * 4.20
 * 引入分页组件
 * 3.23
 * 修正了数量0判断
 * 添加了请求结果保存
 * 3.17
 * 修改CLASS_TABLE_DATA值
 * 3.15
 * 添加序号索引
 * 添加获取键值对名value.js
 */
// 导出excel插件
// 弹出下载插件
import pagination from './pagination'
import page from '@/layout/page'
// 本地存储前缀
const pre = 'list-page'
export default {
  provide() {
    return {
      ROOT: this
    }
  },
  components: { page, pagination },
  data() {
    return {
      NAV_HEIGHT: 50,
      HEADER_HEIGHT: 50,
      PADDING_HEIGHT: 20,
      PAGINATION_HEIGHT: 32,
      OTHER_HEIGHT: 0,
      // 自动加载列表
      AUTOLOAD: true,
      // 本地保存当前页面列设置的key
      COL_KEY: '',
      // 导出的excel文件名
      FILENAME: 'excel文件',
      // 接口地址
      LIST_API: '',
      EXPORT_API: '',
      CREATE_API: '',
      EDIT_API: '',
      DEL_API: '',
      // 存放请求后的结果
      LIST_API_DATA: {},
      // 加载状态
      LOADING: false,
      DEL_LOADING: false,
      // 弹窗数据
      FORM_VISIBLE: false,
      FORM_TYPE: 'view',
      FORM_DATA: {},
      // 默认表格列项
      HEADER: [],
      // 表格列项
      COL_LIST: [],
      // 表格尺寸
      SIZE: 'mini',
      // 页数
      PAGE: 1,
      // 分页大小
      PAGE_SIZE: 100,
      // 分页
      PAGE_SIZES: [10, 50, 100, 200, 300, 400],
      // 分页按钮
      LAYOUT: 'total, sizes, prev, pager, next, jumper',
      // 总数量
      TOTAL: 0,
      // 选中项
      SELECT_lIST: [],
      // 选中的ID字符串拼接
      SELECT_IDS: '',
      // 表格数据
      TABLE_DATA: [],
      // 设置class后的表格数据
      CLASS_TABLE_DATA: [],
      // 导出数据
      EXPORT_DATA: [],
      // 查询时候用的条件
      WHERE: {},
      // 保护的查询条件名
      PROTECT_WHERE: []
    }
  },
  computed: {
    LIST_HEIGHT() {
      return 'calc(100vh - ' + (this.NAV_HEIGHT + this.HEADER_HEIGHT + this.PADDING_HEIGHT * 2 + this.PAGINATION_HEIGHT + 130) + 'px)'
    },
    LIST_HEIGHT_DIALOG() {
      return 'calc(70vh - ' + (this.NAV_HEIGHT + this.HEADER_HEIGHT + this.PADDING_HEIGHT * 2 + this.PAGINATION_HEIGHT + 130) + 'px)'
    }
  },
  created() {
    console.info('[mixin][list][created]')
    console.log('[mixin][list][route]', this.$route)
    this.$getPageSetting()
    // 设置列
    this._setHeader()
  },
  beforeMount() {
    console.info('[mixin][list][beforeMount]')
    // 读取本地
    this.$getColSetting()
  },
  mounted() {
    console.info('[mixin][list][mounted]')
    // 自动加载数据
    if (this.AUTOLOAD) {
      this._getList()
    }
  },
  beforeUpdate() {
    console.info('[mixin][list][beforeUpdate]')
  },
  updated() {
    console.info('[mixin][list][updated]')
  },
  beforeDestroy() {
    console.info('[mixin][list][beforeDestroy]')
  },
  methods: {
    // 请求时候拼接的数据
    PARAMS() {
      return {
        ...this.WHERE,
        page: {
          number: this.PAGE, // 页数
          size: this.PAGE_SIZE // 分页数量
        },
        currentPage: this.PAGE, // 页数
        nextPage: this.PAGE + 1, // 下一页
        totalCount: this.PAGE === 1 ? 0 : this.TOTAL, // 总数，第一页传0
        firstId: (this.TABLE_DATA.length > 0 ? this.TABLE_DATA[0]['id'] : 0),
        lastId: (this.TABLE_DATA.length > 0 ? this.TABLE_DATA[this.TABLE_DATA.length - 1]['id'] : 0)
      }
    },
    /**
     * 内部调用
     * 获取本地的分页数量
     * @private
     */
    $getPageSetting() {
      const pageSize = parseInt(localStorage.getItem(pre + '-size'))
      console.log('[mixin][list]读取分页设置', pageSize)
      this.PAGE_SIZE = (typeof pageSize === 'number' && pageSize) ? pageSize : 100
      console.log('[mixin][list]读取分页设置', pageSize, this.PAGE_SIZE)
    },
    /**
     * 内部调用
     * 设置本地分页数量
     * @param number 分页数
     * @private
     */
    $setPageSetting(number) {
      console.log('[mixin][list]写入分页设置', number)
      localStorage.setItem(pre + '-size', number)
    },
    /**
     * 内部调用
     * 获取本地列表设置
     * @private
     */
    $getColSetting() {
      if (this.COL_KEY) {
        const setting = localStorage.getItem(pre + '-col-setting-' + this.COL_KEY)
        if (setting && JSON.stringify(setting).length > 2) {
          this.HEADER.forEach((v, i) => {
            const item = v
            if (setting[v.key]) {
              item['value'] = setting[v.key]
              setting[v.key] = item
            }
          })
          this.COL_LIST = setting
        } else {
          this.COL_LIST = this.HEADER
        }
        console.log('[mixin][list]工单列表设置', this.COL_LIST)
      } else {
        this.COL_LIST = this.HEADER
        console.log('[mixin][list]无存储KEY')
      }
    },
    /**
     * 列表序号
     * @param {number} index 索引
     * @return {*}
     */
    _indexMethod(index) {
      return index + (this.PAGE - 1) * this.PAGE_SIZE + 1
    },
    /**
     * 获取列表
     */
    _getList() {
      console.info('[mixin][list][getList]', this.AUTOLOAD)
      if (!this.AUTOLOAD) {
        console.log('[mixin][list][getList][自动加载关闭]')
        return
      }
      if (!this.LIST_API) {
        console.log('[mixin][list][getList][未设置接口]')
        return
      }
      const data = this.PARAMS()
      console.log('[mixin][list][getList][条件]', data)
      this.LOADING = true
      this.LIST_API(data).then(res => {
        console.log('[mixin][list][getList][成功]', res)
        this.LOADING = false
        this.LIST_API_DATA = res
        // 兼容返回
        if (res.code) {
          if (parseInt(res.code) === 1000 || parseInt(res.code) === OKCODE) {
            res = res.data
          } else {
            console.log('[mixin][list]服务器繁忙')
            this._showError('服务器繁忙')
            return
          }
        }
        if (res.code === 0) {
          res = res.data
        }
        // 兼容两种不同后端返回分页格式
        this.TABLE_DATA = res['children'] || res['list']
        if (res['total']) {
          if (this.PAGE === 1) {
            this.TOTAL = res['total']
          }
        } else {
          this.TOTAL = parseInt(res['totalElements'] !== undefined && res['totalElements'] !== null ? res['totalElements'] : res['total'])
        }
        this._setClass()
      }).catch(e => {
        console.log('[mixin][list][getList][接口出错]', e)
        this.LOADING = false
      })
    },
    /**
     * 条数
     * @param  {[Int]} val [条数]
     */
    _handleSizeChange(val) {
      console.log(`[mixin][list][分页条数] ${val} `)
      this.$setPageSetting(val)
      this.$getPageSetting()
      this.PAGE = 1
      this._getList()
    },
    /**
     * 当前页
     * @param  {[Int]} val [页数]
     */
    _handleCurrentChange(val) {
      console.log(`[mixin][list][页码]: ${val}`)
      this.PAGE = val
      this._getList()
    },
    /**
     * 列表序号选择
     */
    _handleSelectionChange(val) {
      this.SELECT_lIST = val
      this.SELECT_IDS = ''
      val.forEach(v => {
        this.SELECT_IDS += v.id + ','
      })
      console.log('[mixin][list][序号选择]', this.SELECT_IDS)
    },
    /**
     * 查询
     */
    _search() {
      console.log('[mixin][list][查询]')
      // 清空选中项
      this.SELECT_lIST = []
      this.SELECT_IDS = ''
      // 重置页数
      this.PAGE = 1
      this.TOTAL = 0
      this._getList()
    },
    /**
     * 重置条件
     */
    _reset() {
      console.log('[mixin][list][重置条件]')
      // 关闭弹窗
      this.CREATE_VISIBLE = false
      this.EDIT_VISIBLE = false
      // 弹窗数据
      this.CREATE_DATA = {}
      this.EDIT_DATA = {}
      // 还原页码
      this.PAGE = 1
      this.TOTAL = 0
      // 清空值
      for (const item in this.WHERE) {
        console.log('[mixin][list]清空条件', item + '---' + this.WHERE[item])
        // 不清楚保护的条件
        if (this.PROTECT_WHERE.indexOf(item) === -1) {
          this.WHERE[item] = ''
        }
      }
      this._search()
    },
    /**
     * 清除列表数据和选中导出的数据
     * @private
     */
    _resetList() {
      this.SELECT_IDS = ''
      this.SELECT_lIST = []
      this.TABLE_DATA = []
      this.CLASS_TABLE_DATA = []
      this.EXPORT_DATA = []
    },

    /**
     * 点击导出按钮后的数据组装
     */
    _export() {
      // 开始导出  默认操作 大部分情况需在页面里指定
      console.log('选中项', this.SELECT_lIST)
      if (this.SELECT_lIST.length > 0) {
        this.EXPORT_DATA = this.SELECT_lIST
        this._exportExcel()
      } else {
        this._showWarning('请至少选择一项')
      }
    },
    /**
     * 设置类
     */
    _setClass() {
      console.log('[mixin][list]设置类')
      this.CLASS_TABLE_DATA = this.TABLE_DATA
    },
    /**
     * 设置表格列项
     */
    _setHeader(list) {
      this.HEADER = list
      /*
      this.HEADER = [
        {
          name: '工单编号',
          key: 'caseNo',
          edit: false,
          show: true,
          value: 100
        },
        {
          name: '操作',
          key: 'action',
          edit: false,
          show: true,
          value: 300
        }
      ]*/
    },
    _showError(title) {
      console.log('[mixin][list]输出失败', title)
      this.$notify.error(title)
    },
    _showInfo(title) {
      console.log('[mixin][list]输出信息', title)
      this.$notify.info(title)
    },
    _showWarning(title) {
      console.log('[mixin][list]输出警告', title)
      this.$notify.warning(title)
    },
    _showSuccess(title) {
      console.log('[mixin][list]输出成功', title)
      this.$notify.success(title)
    }
  }
}
